<template>
	<view class="orderEliminate-main" v-if="orderInfo">
		<view class="orderEliminate-shop">
			<view class="orderEliminate-shopHeader">
				<uni-icons type="gift" size="20" color="#444"></uni-icons>
				商品数据
			</view>
			<view class="orderInfo-shopData" v-for="(item, index) in orderInfo.goods_info" :key="item.info.id">
				<view class="shopimage">
					<image :src="imageUrls(item.fileUrl)" class="images"></image>
				</view>
				<view class="shopinfo">
					<view class="shopinfo-title">
						<text class="title">{{ item.name }}</text>
						<text class="pir">
							¥
							<text style="font-size: 16px">{{ item.price != '0.00' ? item.price : item.saleprice.toFixed(2) }}</text>
						</text>
					</view>
					<view class="shopinfo-gg">
						<text>规格:{{ item.spec }}</text>
						<text>x{{ item.buy_num }}</text>
					</view>
					<view class="shopinfo-tags">
						<uni-tag :text="item.mediaName" size="mini" style="margin-right: 8rpx" type="error"></uni-tag>
					</view>
				</view>
			</view>
			<view class="shopPir">
				<view class="">商品总金额</view>
				<view style="color: #e43927; font-weight: bold; font-size: 32rpx">￥{{ orderInfo.pay_money || '0.00' }}</view>
			</view>

			<view class="order_create">
				<view class="orderItem">
					<view class="orderName">订单编号</view>
					<view class="orderValue">
						{{ orderInfo.order_no }}
					</view>
				</view>
				<view class="orderItem">
					<view class="orderName">下单时间</view>
					<view class="orderValue">
						{{ formatTimestamps(orderInfo.createtime) }}
					</view>
				</view>
			</view>
		</view>

		<view class="orderEliminate-btn" @click="getstoreselfTake">确认核销</view>
	</view>
</template>

<script>
import { flashManageOrderDetail } from '../../../api/flashManage/index.js';
import { formatTimestamp, imageUrl } from '../../../utils/tools.js';
import {storeselfTake } from '../../../api/payment/index.js';
export default {
	data() {
		return {
			storeType: '',
			order_id: '',
			orderInfo: null
		};
	},
	onLoad(option) {
		const { id } = option;
		this.order_id = id;
		this.storeType = this.$store.state.storeType;
		this.getflashManageOrderDetail();
	},
	methods: {
		async getflashManageOrderDetail() {
			try {
				const resData = await flashManageOrderDetail({
					id: this.order_id,
					type: this.storeType
				});
				this.orderInfo = resData.data;
			} catch (e) {
				throw Error(e);
				//TODO handle the exception
			}
		},
		imageUrls(url) {
			return imageUrl(url);
		},
		// 时间格式化
		formatTimestamps(timestamp) {
			return formatTimestamp(timestamp);
		},
		// 核销
		async getstoreselfTake() {
			try {
				const resData = await storeselfTake({
					order_no: this.orderInfo.order_no,
					type: this.storeType
				});

				if (resData.code == 1) {
					uni.showModal({
						title: '温馨提示',
						showCancel: false,
						content: '订单销核成功！请勿重复操作',
						success: function (res) {
							uni.navigateBack(-1);
						}
					});
				}
			} catch (e) {
				uni.navigateBack(-1);
				throw Error(e);
			}
		}
	}
};
</script>

<style>
page {
	background-color: #fff;
}
</style>

<style scoped lang="scss">
.orderEliminate-main {
	box-sizing: border-box;
	padding: 30rpx;
}

.orderEliminate-btn {
	height: 40px;
	line-height: 40px;
	background-color: #e43927;
	text-align: center;
	font-size: 28rpx;
	color: #fff;
	border-radius: 10px;
	margin-top: 30px;
}

.orderEliminate-shop {
	.orderEliminate-shopHeader {
		height: 40px;
		border-bottom: 1px #f3f3f3 solid;
		font-size: 28rpx;
		color: #444;
		font-weight: bold;
		display: flex;
		align-items: center;
	}
	.orderInfo-shopData {
		display: flex;
		box-sizing: border-box;
		padding: 20rpx 0px;
		padding-bottom: 10rpx;
		border-bottom: 1px #f3f3f3 solid;
		.shopimage {
			width: 180rpx;
			height: 180rpx;
			.images {
				width: 160rpx;
				height: 160rpx;
			}
		}
		.shopinfo {
			flex: 1;
			.shopinfo-title {
				display: flex;
				font-size: 30rpx;
				justify-content: space-between;
				.title {
					flex: 1;
					font-size: 26rpx;
					font-weight: bold;
					color: #444;
				}
				.pir {
					font-size: 12px;
					color: #444;
					margin-left: 10rpx;
				}
			}

			.shopinfo-gg {
				display: flex;
				justify-content: space-between;
				margin: 15rpx 0px;
				font-size: 24rpx;
				color: #999;
			}
		}
	}

	.shopPir {
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 28rpx;
		margin: 10px 0px;
	}

	.order_create {
		.orderItem {
			height: 70rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-size: 24rpx;
			.orderName {
				color: #999;
			}
			.orderValue {
				.copy {
					display: inline-block;
					padding: 8rpx 18rpx;
					border-radius: 24rpx;
					background-color: #f3f3f3;
					margin-left: 12rpx;
					font-size: 24rpx;
				}
			}
		}
	}
}
</style>
